<template>
  <div class="list-wrap" v-html="cinemaList">
    
  </div>
</template>

<script>
export default {
  data() {
    return {
      // 影院列表数据
      cinemaList:"",
      limit: 1,
      subItems:[]
    };
  },
  // 影院
  async mounted() {
    let data = await this.$api.moreCinemas({
      offset: 10,
      limit: 200,
      cityId: 30,
    });
    //  console.log(data);
    this.cinemaList = data;
    //  console.log(this.$api);


    let ret = await this.$api.filterCinemas({
      // ci:30,
      // optimus_risk_level:70,
      // optimus_code:10
    });
    //  console.log(ret);
    this.subItems = ret.brand.subItems;
    //  console.log(this.$api);
  },
  

  
};
</script>

<style lang="scss" >

  .list-wrap {
    background: #fff;
    margin-top: 0;
    min-height: 300px;
    a {
      .item {
        padding: 13px 15px 13px 0;
        padding-left: 15px;
        background: #fff;
        position: relative;
        overflow: hidden;
        border-bottom: 1px solid #ccc;
        border-top: 1px solid #ccc;
      }
      .title-block{
          display: block;
      }
      .title {
        height: 23px;
        line-height: 23px;
        font-size: 16px;
        color: #000;
      }
      .line-ellipsis{
        text-overflow: ellipsis;
        overflow: hidden;
        white-space: nowrap;
      }
      .price-block {
        padding-top: 9px;
        padding-left: 3px;
        line-height: 1.5;
      }
      .price {
        font-size: 18px;
        color: #f03d37;
      }
      .q {
        margin-left: 3px;
        font-size: 11px;
        color: #f03d37;
      }
      .location-block {
        display: flex;
        margin-top: 6px;
        font-size: 13px;
        color: #666;
      }
      .flex {
        -webkit-box-flex: 1;
        flex: 1;
      }
      .line-ellipsis {
        width: 294px;
        text-overflow: ellipsis;
        overflow: hidden;
        white-space: nowrap;
      }
      .distance {
        margin-left: 5px;
      }
      .label-block {
        height: 17px;
        line-height: 17px;
        margin-top: 4px;
        margin-bottom: 4px;
        overflow: hidden;
        font-size: 0;
        flex-shrink: 0;
      }
      .label-block > div {
        display: inline-block;
        font-size: .6rem;
        position: relative;
        padding: 0 3px;
        height: 15px;
        line-height: 15px;
        border-radius: 2px;
      }
      .allowRefund{
        color: #589daf;
        border: 1px solid #589daf;
      }
      .endorse {
        color: #589daf;
        border: 1px solid #589daf;
        margin-left: 5px;
      }
      .snack {
            color: #f90;
            border: 1px solid #f90;
            margin-left: 5px;
      }
      .vipTag {
        color: #f90;
        border: 1px solid #f90;
        margin-left: 5px;
      }
      .hallType{
          color: #589daf;
          border: 1px solid #589daf;
          margin-left: 5px;
      }
      .discount-block {
        color: #999;
        margin-bottom: 4px;
      }
      .discount-label{
          line-height: 1.5;
          width: 15px;
          height: 14px;
          position: relative;
          display: inline-flex;
      }
      .discount-label img {

        width: 100%;
        height: 14px;
        position: relative;
        top: 3px;
        display:block;
      }
      
      .discount-label-text{
        margin-left: 0px;
        padding-top: 5px;
        font-size: 11px;
        display: inline-block;
      }
    }
    &:last-child {
      margin-bottom: 50px;
    }
  }

</style>
